<template>
	<view class="guestbook-container">
		<unicloud-db where="state==true||user_id._id==$cloudEnv_uid" v-slot:default="{data, loading, error, options}" collection="guestbook,uni-id-users" field="_id,text,state,user_id.nickname,user_id.avatar_file,user_id._id">
			<view v-if="error">{{error.message}}</view>
			<view v-else>
				
				<view v-for="(item, index) in data">
					<uni-card :title="item.text" :isFull="true" :subTitle="item.user_id[0].nickname"
						:extra="item.state?'':'未审核'" :thumbnail="item.user_id[0].avatar_file.url">
					</uni-card>
				</view>
				
			</view>
		</unicloud-db>
		<view class="submit-box">
			<uni-easyinput placeholder="请输入留言" v-model="text"></uni-easyinput>
			<button type="default" style="width: 180rpx;height: 70rpx;line-height: 70rpx;" @click="text?add():''">发送</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				text: ""
			}
		},
		methods: {
			add() {
				const db = uniCloud.database()
				const guestbookTable = db.collection('guestbook')
				guestbookTable.add({
					"text": this.text,
					"state": false
					// "user_id": "123456"
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		height: 100%;
		.guestbook-container {
			height: 100%;
			position: relative;
			.submit-box {
				display: flex;
				position: absolute;
				bottom: 0;
				width: 100%;
			}
		}
	}
</style>
